<script type="text/html" data-template-name="ha-mqtt-device">
    <div class="form-row">
        <label for="node-config-input-name" data-i18n="node-red-contrib-ha-mqtt/common:label.deviceName"></label>
        <input type="text" id="node-config-input-name" data-i18n="[placeholder]node-red-contrib-ha-mqtt/common:label.deviceName">
    </div>
    <div class="form-row">
        <a href="https://developers.home-assistant.io/docs/device_registry_index/" target="_blank" style="color:blue;">
            <label for="node-input-config" data-i18n="node-red-contrib-ha-mqtt/common:label.config"></label>   
        </a>
        <input type="text" id="node-config-input-config" data-i18n="[placeholder]node-red-contrib-ha-mqtt/common:label.config">
    </div>    
    <div class="form-row">
      <label for="node-config-input-retain">
        retain
      </label>
      <label style="width: 70%;">
        <input type="checkbox" id="node-config-input-retain" style="display:inline-block; width:22px; vertical-align:top;" autocomplete="off"/>
        <span data-i18n="node-red-contrib-ha-mqtt/common:label.retainMessage" style="user-select: none;"></span>
      </label>      
    </div>
</script>

<script type="text/javascript">
  RED.nodes.registerType('ha-mqtt-device', {
    category: 'config',
    defaults: {
      name: { value: "", required: true },
      config: { value: "" },
      retain: { value: false }
    },
    label: function () {
      return this.name.trim();
    },
    oneditprepare: function () {
      $("#node-config-input-config").typedInput({ type: "json", types: ["json"] })
    }
  });
</script>